<!-- 修改密码 -->
<template>
	<view>
		<view class="f30 mb20">
			{{$t("zh.p1")}}
		</view>
		<view class="inpbox bj_left mb20">
			<image src="/static/page5/p.png" class="inpbox-passico"></image>
			<input type="password" v-model="from.pass1" maxlength="50" :placeholder="$t('zh.p2')" />
		</view>
		<view class="inpbox bj_left mb30">
			<image src="/static/page5/p.png" class="inpbox-passico"></image>
			<input type="password" v-model="from.pass2" maxlength="50" :placeholder="$t('zh.p3')" />
		</view>
		<view class="inpbox-btn" @click="repass">
			{{$t("zh.btn")}}
		</view>
		<uni-popup ref="message" type="message">
			<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
		</uni-popup>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onShow
	} from "@dcloudio/uni-app"
	import useI18n from '@/store/useI18n.js'
	import common from '../../js/common';
	const {
		t
	} = useI18n()
	let message = ref(null)
	let msgType = ref("")
	let messageText = ref("")
	let from = ref({
		pass1: "",
		pass2: ""
	})

	function repass() {
		if (from.value.pass1 == "") {
			msgType.value = "error"
			messageText.value = t("pass.e1");
			message.value.open();
			return
		}

		if (from.value.pass2 == "") {
			msgType.value = "error"
			messageText.value = t("pass.e2");
			message.value.open();
			return
		}


		common.changepwd({
			password: from.value.pass1,
			newPassword: from.value.pass2,
			confirmNewPassword: from.value.pass2
		}).then(res => {
			if(res.data.success){
				msgType.value = "success"
				messageText.value = res.data.message;
				message.value.open();
				getApp().globalData.userInfo = null
				localStorage.removeItem("userInfo")
				uni.navigateBack()
			} else {
				msgType.value = "error"
				messageText.value = res.data.message;
				message.value.open();
			}
		})
	}
</script>

<style scoped lang="scss">
	.inpbox {
		height: 88rpx;
		background: #001F0A;
		border-radius: 12rpx;
		border: 2rpx solid #00561D;
		padding-left: 24rpx;

		&-passico {
			width: 78rpx;
			height: 48rpx;
			padding-right: 30rpx;
			border-right: 2rpx solid #1D4B8E;
			margin-right: 30rpx;
		}

		&-btn {
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			font-size: 36rpx;
			font-weight: bold;
			background: linear-gradient( 180deg, #00802B 0%, #06C045 100%);
			border-radius: 12rpx 12rpx 12rpx 12rpx;
		}
	}
</style>